<template>
  <div style="height:100%">
    <div class="toptop">
      <div>
        <span v-if="UserInfo.adminStatus == 1">
          <span style="margin-right: 24px;">公司</span>
          <el-select ref="company" v-model="companyId" placeholder="请选择" @change="setstationIdlist(),$nextTick(()=>{companyName = $refs.company.selectedLabel})">
            <el-option v-for="(item, index) in companylist" :key="index" :label="item.name" :value="item.id"></el-option>
          </el-select>
        </span>
        <span style="margin-left: 24px;">
          <span style="margin-right: 24px;">站点</span>
          <el-select v-model="siteId" placeholder="请选择">
            <el-option v-for="(item, index) in siteList" :key="index" :label="item.name" :value="item.id"></el-option>
          </el-select>
        </span>
      </div>
      <el-button size="small" class="bottom_all" @click="saveValue()">保存</el-button>
    </div>
    <div class="items">
      <div class="item">
        <div class="item-title">强度等级</div>
        <div class="radio">
          <el-radio-group v-model="lifeId" @change="getValue()">
            <template v-for="(item, index) in lifeList">
              <div :key="index" class="radio-bg">
                <el-radio :label="item.id">{{ item.name }}</el-radio>
              </div>
            </template>
          </el-radio-group>
        </div>
      </div>
      <div class="item-hr"></div>
      <div class="item">
        <div class="item-title">砼经时预警</div>
        <div class="radio">
          预警时间：
          <div style="margin:10px 0;">
            <el-input v-model="hour" onkeypress="return(/\d|\./.test(String.fromCharCode(event.keyCode)))" placeholder="请输入内容" @blur="hour=$regExp.blurCheckNum(hour)" @input="hour=$regExp.checkNum(hour)">
              <template slot="append">小时</template>
            </el-input>
            <div style="margin:10px 0;">
              当前该标号预警值的公司标准为：{{companyHour?companyHour+'小时':'公司暂未设置'}}
            </div>
          </div>
          <div style="padding-top:50px;">
            限制卸料时间：
            <div style="margin:10px 0;">
              <el-input v-model="limitUnloading" placeholder="请输入内容" onkeypress="return(/\d|\./.test(String.fromCharCode(event.keyCode)))" @blur="limitUnloading=$regExp.blurCheckNum(limitUnloading)" @input="limitUnloading=$regExp.checkNum(limitUnloading)">
                <template slot="append">小时</template>
              </el-input>
            </div>
            <div style="margin:10px 0;">
              当前该标号预警值的公司标准为：{{companyHour2?companyHour2+'小时':'公司暂未设置'}}
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import { getcompany, getListByTypeId, getUserAutList, getStationByCompanyId, get_simple_organization } from "@/api/common.js";
import { getUserInfo } from "@/utils/auth.js";
import {
  queryBindingTime, stationqueryBindingTime, stationsave_or_update
} from '@/api/basicConfig/CPYquality.js';
export default {
  data() {
    return {
      UserInfo: getUserInfo(),
      companylist: [],
      companyId: "",
      companyName: '',
      siteList: [],
      siteId: '',
      lifeId: '',
      lifeList: [],
      hour: '',
      companyHour: '',
      companyHour2: '',
      limitUnloading: '',
    }
  },
  async created() {
    if (getUserInfo().adminStatus == 1) {
      /**通过typeId为公司类型id查询所有公司 */
      getcompany({ typeId: "19da56b9e85648059e3cf1e7da497da4" }).then((res) => {
        this.companylist = res.data;
        this.companyId = this.companylist[0].id
      });
    } else {
      this.siteList = await getUserAutList(true)
      this.siteId = this.siteList[0].id
    }
    const { data: list } = await getListByTypeId({ typeId: 1 })
    this.lifeList = list

  },
  methods: {
    /**限制后两位两位小数*/
    handleInput2(e) {
      this.hour = (e.match(/^\d*(\.?\d{0,2})/g)[0]) || null
    },
    /*根据公司获取站点*/
    setstationIdlist() {
      getStationByCompanyId({ id: this.companyId }).then((res) => {
        this.siteList = res.data.map(res => ({ name: res.stationName, id: res.id }));
        this.siteId = ''
      });
    },
    /*获取标号值*/
    async getValue() {
      await get_simple_organization({ id: this.siteId }).then((res) => {
        this.companyId = res.data.id
        this.companyName = res.data.name
      });
      await queryBindingTime({ companyId: this.companyId, markNumberId: this.lifeId }).then(res => {
        this.companyHour = res.data.usefulLife
        this.companyHour2 = res.data.limitUnloading
      })
      await stationqueryBindingTime({ companyId: this.companyId, stationId: this.siteId, markNumberId: this.lifeId }).then(res => {
        this.hour = res.data.usefulLife
        this.limitUnloading = res.data.limitUnloading
      })
    },
    saveValue() {
      const params = {

        markNumberId: this.lifeId,
        markNumberName: this.lifeList.find(res => (res.id == this.lifeId)).name,
        stationId: this.siteId,
        stationName: this.siteList.find(res => (res.id == this.siteId)).name,
        companyId: this.companyId,
        companyName: this.companyName,
        usefulLife: this.hour,
        limitUnloading: this.limitUnloading,
      }
      stationsave_or_update(params).then(res => {
        if (res.code * 1 === 1001) {
          this.$message.success('保存成功')
          // this.saveValue()
        }
      })
    },
  }
}
</script>
<style lang="scss" scoped>
.toptop {
  padding: 20px 20px 0 20px;
  @include discen_al;
  justify-content: space-between;
}
.items {
  padding: 20px;
  display: flex;
  height: 100%;
}
.item {
  border: 1px solid rgba(225, 229, 237, 1);
  border-radius: 4px;
  width: 360px;
  .item-title {
    color: #000000;
    background: #e1e5ed;
    font-size: 14px;
    @include discen;
    height: 56px;
    font-weight: bold;
  }
}
.item-hr {
  width: 20px;
  height: 20px;
}
.radio {
  padding: 20px;
  height: 600px;
}
.radio {
  padding: 20px;
  .radio-bg {
    height: 28px;
  }
}
.text {
  padding: 50px 0;
  text-align: center;
}
</style>